<template>
  <div class='nav bc-white'>
    <span>签到记录 <span class='number'>({{total||0}}次)</span></span>
    <span class="fr choose active" @click="diaShow.show=true">筛选</span>
    <ChooseAlert :diaShow="diaShow" @get_search="getSearch" />
  </div>
</template>
<script>
import ChooseAlert from './alert.vue'
export default {
  props:["total"],
  components: {ChooseAlert},
  name: "",
  data() {
    return {
      diaShow:{
        show:false,
        category:[]
      }
    };
  },
  methods: {
    /**
     * 筛选
     */
    getSearch(){
      this.$emit("get_search",this.diaShow.category.join(","))
    }
  },
  created() {},
};
</script>
<style lang="scss" scoped>
.nav {
  padding: 20px;
  font-size: 16px;
  box-sizing: border-box;
  border-bottom: 1px solid #ddd;


  .number{
    font-size: 13px;
    color: #999
  }
  .choose{
    border: 1px solid #00998d;
    color: #00998d;
    padding: 0 20px;
    border-radius: 20px;
  }
}
</style>